<template>
  <div>
    <!-- 按钮 -->
    <div class="btns">
      <el-form size="small" inline style="text-align:right">
        <br>
        <el-form-item>
          <el-input v-model="param.name" placeholder="请输入权限名称"></el-input>
        </el-form-item>
      <el-form-item>
      <el-button size="small" type="primary" plain round @click="loadbasePrivilege" icon="el-icon-search">搜索</el-button>
      <el-button size="small" type="primary" plain round @click="toAddHandler" icon="el-icon-plus" >新增</el-button>
      <el-button size="small" type="primary" plain round @click="downloadHandler" icon="el-icon-upload2">导出</el-button>
      </el-form-item>
      </el-form>
    </div>

      <!-- /按钮 -->
     <!-- {{applications}}  -->
      <!-- 表格 -->   
    <el-table  :data="basePrivilege" border="ture">
      <el-table-column type="index" :index="1" label="序号" align="center" width="100"></el-table-column>
      <el-table-column label="名称" prop="name" align="center" width="140"></el-table-column>
      <el-table-column label="描述" prop="description" align="center" ></el-table-column>
      <el-table-column label="路径" prop="route" align="center"></el-table-column>
      <el-table-column label="路径名字" prop="routeName" align="center"></el-table-column>
      <el-table-column label="类型" prop="type" align="center" ></el-table-column>
      <el-table-column label="隐藏" prop="hidden" align="center"></el-table-column>
      <el-table-column label="图标" prop="icon" align="center"></el-table-column>
      <el-table-column label="父id" prop="parentId" align="center"></el-table-column>
      <el-table-column label="数量" prop="num" align="center" ></el-table-column>
      <el-table-column label="操作" align="center"  width="120">
      <template slot-scope="scope">
          <el-button type="primary" icon="el-icon-edit" circle @click="editHandler(scope.row)"></el-button>
          <el-button type="danger" icon="el-icon-delete" circle @click="deleteHandler(scope.row)"></el-button>
           </template>
      </el-table-column>
    </el-table>
      <!-- /表格 -->
  </div>
    
</template>

<script>
import {get,del} from '@/utils/request'
export default {
    //页面数据
    data(){
        return{
             param:{},
            basePrivilege:[]
        }
    },
    //页面渲染的时候会调用的函数
    created(){
       this.loadbasePrivilege();
    },
    //所有的方法
    methods:{
      downloadHandler(){
        if(this.param.name){
      window.location.href = "http://localhost:8888/basePrivilege/download?name="+this.param.name;
      }else {
        window.location.href = "http://localhost:8888/basePrivilege/download"
      }

    },
      editHandler(row){
this.$router.push({
  path:"/baseprivilege/create",
  query:row
})
      },
      deleteHandler(row) {
      this.$confirm("此操作将永久删除该数据, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        let url = "http://localhost:8888/basePrivilege/deleteById";
        del(url, { id: row.id }).then((resp) => {
          this.$message({ type: "success", message: resp.message });
          this.loadbasePrivilege();
        });
      });
    },
        toAddHandler(){
    this.$router.push("/baseprivilege/baseprivileg")
        },
    loadbasePrivilege(){
            let url='http://localhost:8888/basePrivilege/query'
            get(url,this.param).then((resp)=>{
                this.basePrivilege=resp.data;
            })
        }
    }
}

</script>

<style scoped>
.btns {
  margin-bottom: .5em;
}
.el-form{
  background-color: rgb(56, 123, 211);
}

</style>